<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>消息列表</title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/font-awesome-4.3.0/css/font-awesome.min.css" />
		<link href="../css/config.css" rel="stylesheet" />
		<link href="../css/base.css" rel="stylesheet" />
		<link href="../css/index.css" rel="stylesheet" />
		<link href="../css/circle.css" rel="stylesheet" />
		<style>
			.header-tabbar .mui-segmented-control {
				width: 60%;
				left: 20%;
				margin-left: 0px;
			}
			
			.mui-table-view-cell .title {
				color: #333;
				line-height:30px;
				    margin-top: 5px;
			}
			.mui-table-view-cell .info{
				line-height:21px;
				    margin-bottom: 5px;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav km-navbar white-header" style="box-shadow:none;">
			<a class="mui-icon mui-icon-back mui-pull-left mui-action-back"></a>
			<div class="header-tabbar">
				<div id="segmentedControl" class="mui-segmented-control">
					<a class="mui-control-item mui-active" id="messageStyle1">
                             系统
                        </a>
					<a class="mui-control-item" id="messageStyle2">
                            圈子
                        </a>
					<a class="mui-control-item" id="messageStyle3">
                            私信
                        </a>
				</div>
			</div>
		</header>
		<div class="mui-content3">
			<!--系统消息-->
			<div id="messageStyle1div">
				<ul class="mui-table-view" id="area-message-list">
					<li class="mui-table-view-cell">
						<div class="mui-slider-right mui-disabled">
							<a class="mui-btn mui-btn-red">删除</a>
						</div>
						<a class="mui-navigate-right" href="circle-message-view.html">
							<div class="mui-slider-handle">
								<div class="title">山西省首届伤口造口管理及学术交流会在并召开</div>
								<p class="info"><span class="message-time">10:00</span><span class="geduan">｜</span>Admin</p>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<div class="mui-slider-right mui-disabled">
							<a class="mui-btn mui-btn-red">删除</a>
						</div>
						<a class="mui-navigate-right" href="circle-message-view.html">
							<div class="mui-slider-handle">
								<div class="title">关于医院供暖设施注水、打压的通知</div>
								<p class="info"><span class="message-time">10:00</span><span class="geduan">｜</span>Admin</p>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<div class="mui-slider-right mui-disabled">
							<a class="mui-btn mui-btn-red">删除</a>
						</div>
						<a class="mui-navigate-right" href="circle-message-view.html">
							<div class="mui-slider-handle">
								<div class="title">关于医院供暖设施注水、打压的通知</div>
								<p class="info"><span class="message-time">10月2日&nbsp;10:00</span><span class="geduan">｜</span>Admin</p>
							</div>
						</a>
					</li>
				</ul>
			</div>
			<!--圈子消息-->
			<div id="messageStyle2div" style="display: none;">
				<ul class="message-circle mui-table-view" id="message-circle1">
					<li class="mui-table-view-cell">
						<div class="mui-slider-right mui-disabled">
							<a class="mui-btn mui-btn-red">删除</a>
						</div>
						<a class="mui-navigate-right" href="circle-message-shenqing.html">
							<div class="mui-slider-handle">
								<div class="img bgcolor-1"><img src="../img/message-yuanwu.png" /></div>
								<dl>
									<dt>待处理的消息</dt>
									<dd>“xxx”等六人申请入圈</dd>
								</dl>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<div class="mui-slider-right mui-disabled">
							<a class="mui-btn mui-btn-red">删除</a>
						</div>
						<a class="mui-navigate-right" href="circle-post.html">
							<div class="mui-slider-handle">
								你的话题<font color="#333;">“如何脱离单身”</font>下有4条回复
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<div class="mui-slider-right mui-disabled">
							<a class="mui-btn mui-btn-red">删除</a>
						</div>
						<a class="mui-navigate-right" href="circle-post.html">
							<div class="mui-slider-handle">
								xxxx在话题<font color="#333;">“如何脱离单身”</font>中回复了你
							</div>
						</a>
					</li>
				</ul>
			</div>
			<!--私信消息-->
			<!--判断身份，如果是医生给患者发，跳到circle-private-message-d2p.html,
				如果是患者给患者发,及医生给医生发，跳到circle-private-message-same.html
			-->
			<div id="messageStyle3div" style="display: none;">
				<ul class="message-circle2 mui-table-view" id="message-circle2">
					<li class="mui-table-view-cell">
						<div class="mui-slider-right mui-disabled">
							<a class="mui-btn mui-btn-red">删除</a>
						</div>
						<a href="circle-private-message-d2p.html" class="mui-navigate-right">
							<div class="mui-slider-handle">
								<div class="img bgcolor-1"><img src="../img/example1.png" /></div>
								<dl>
									<dt>王医生</dt>
									<dd>你好在吗</dd>
								</dl>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<div class="mui-slider-right mui-disabled">
							<a class="mui-btn mui-btn-red">删除</a>
						</div>
						<a href="circle-private-message-same.html" class="mui-navigate-right">
							<div class="mui-slider-handle">
								<div class="img bgcolor-1"><img src="../img/example1.png" /></div>
								<dl>
									<dt>另一个患者</dt>
									<dd>你好在吗</dd>
								</dl>
							</div>
						</a>
					</li>
				</ul>
			</div>
		</div>
	</body>
	<script src="../js/mui.min.js"></script>
	<script src="../js/Global.js"></script>
	<script src="../js/zepto.min.js"></script>
	<script>
		mui.init({
			swipeBack: true,
			statusBarBackground: '#f7f7f7',
			statusBarStyle: 'UIStatusBarStyleDefault'
		});
		mui('.mui-scroll-wrapper').scroll();
		//=======菜单切换
		mui('#segmentedControl').on('tap', 'a', function() {
				var id = this.id;
				$("#" + id + "div").show().siblings("div").hide();
			})
			//=======系统消息-点击事件
		mui('#area-message-list').on('tap', 'a', function() {
				var id = this.id;
				var title = this.title;
				var href = this.href;
				openWindow(href, href, {
					id: id,
					title: title
				});
			})
			//=======圈子消息列表-点击事件
		mui('#message-circle1').on('tap', 'a', function() {
				var id = this.id;
				var title = this.title;
				var href = this.href;
				openWindow(href, href, {
					id: id,
					title: title
				});
			})
			//=======私信列表-点击事件
		mui('#message-circle2').on('tap', 'a', function() {
			var id = this.id;
			var title = this.title;
			var href = this.href;
			openWindow(href, href, {
				id: id,
				title: title
			});
		})
	</script>

</html>